<template>
  <n-popconfirm
    :positive-text="$t(`${props.positiveText}`)"
    :negative-text="$t(`${props.negativeText}`)"
    @positive-click="handleSubmit"
    @negative-click="handleCancel"
  >
    <template #trigger>
      <n-gradient-text :type="props.gradientType">
        <n-button :type="props.buttonType" :text="true">{{ props.btnName || $t('common.button') }}</n-button>
      </n-gradient-text>
    </template>
    {{ props.msg || $t('common.popconfirm_tips') }}
  </n-popconfirm>
</template>
<script setup lang="ts">
interface Props {
  negativeText?: string | null
  positiveText?: string | null
  btnName: string
  msg: string
  gradientType?: 'error' | 'primary' | 'info' | 'success' | 'warning' | 'danger' | undefined
  buttonType?: 'default' | 'tertiary' | 'primary' | 'success' | 'info' | 'warning' | 'error' | undefined
}

const props = withDefaults(defineProps<Props>(), {
  negativeText: 'common.cancel',
  positiveText: 'common.confirm',
  gradientType: 'error',
  buttonType: 'error',
})

const emit = defineEmits<{
  (e: 'handle-submit'): void
  (e: 'handle-cancel'): void
}>()

const handleSubmit = () => {
  emit('handle-submit')
}

const handleCancel = () => {
  emit('handle-cancel')
}
</script>
